<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>06_for_of循环</title>
  <style>
	  .completed{
		  text-decoration: line-through;
	  }
  </style>
</head>
<body>
	<!--
	for(let value of target){}循环遍历
	  1. 遍历数组
	  2. 遍历Set
	  3. 遍历Map
	  4. 遍历字符串
	  5. 遍历伪数组
	-->

<button>按钮1</button>
<button>按钮2</button>
<button>按钮3</button>

<script type="text/javascript">
    let arr = [1,2,3,4,5];
	// for(let i=0;i<arr.length;i++){
	// 	console.log(arr[i])
	// }
	// arr.forEach(i=>{
	// 	console.log(i)
	// })
	// for(let i in arr){
	// 	console.log(arr[i])
	// }
	
	// 数组
    for(let num of arr){
		console.log('数组:'+num);
    }
	
	// Set
    let set = new Set([11,22,33,44,55]);
    for(let num of set){
        console.log('set:'+num);
    }
	
	// Map
	let map=new Map([
		[1,'one'],
		[2,'two'],
		[3,'three'],
	])
	for(m of map){
		console.log('map:'+m);
	}
	
	// 字符串
    let str = 'abcdefg';
    for(let num of str){
        console.log('string:'+num);
    }
	
	// 伪数组
    let btns = document.getElementsByTagName('button');
    for(let btn of btns){
       btn.addEventListener('click',function(){
		   this.classList.toggle('completed');
	   })
    }
	function sum(){
		let total=0;
		for(let num of arguments){
			total+=num;
		}
		console.log(total);
		return total;
	}
	sum(10,20,30,40,50)

</script>
</body>

</html>